<template>
	<div style="padding: 15px 20px 0 10px">
		<el-table :data="orderResult" ref="singleTable" @current-change="handleCurrentChange" style="width: 100%"
			stripe>
			<el-table-column prop="name" label="名字" width="120" align="center">
			</el-table-column>
			<el-table-column label="周一" align="center">
				<el-table-column label="上午" align="center">
					<template #default="scope">
						<!-- <el-button type="text" size="small" @click="handleClick1(scope.row)">点击预约</el-button> -->
						<el-button v-if="handle_morning(scope.row.week1)" @click="submit(scope.row,0,1)">预约</el-button>
						<span v-else></span>
					</template>
				</el-table-column>
				<el-table-column label="下午" align="center">
					<template #default="scope">
						<el-button v-if="handle_after(scope.row.week1)" @click="submit(scope.row,1,1)">预约</el-button>
						<span v-else></span>
					</template>
				</el-table-column>
			</el-table-column>
			<el-table-column label="周二" align="center">
				<el-table-column label="上午" align="center">
					<template #default="scope">
						<!-- <el-button type="text" size="small" @click="handleClick1(scope.row)">点击预约</el-button> -->
						<el-button v-if="handle_morning(scope.row.week2)" @click="submit(scope.row,0,2)">预约</el-button>
						<span v-else></span>
					</template>
				</el-table-column>
				<el-table-column label="下午" align="center">
					<template #default="scope">
						<el-button v-if="handle_after(scope.row.week2)" @click="submit(scope.row,1,2)">预约</el-button>
						<span v-else></span>
					</template>
				</el-table-column>
			</el-table-column>
			<el-table-column label="周三" align="center">
				<el-table-column label="上午" align="center">
					<template #default="scope">

						<el-button v-if="handle_morning(scope.row.week3)" @click="submit(scope.row,0,3)">预约</el-button>
						<span v-else></span>
					</template>
				</el-table-column>
				<el-table-column label="下午" align="center">
					<template #default="scope">
						<el-button v-if="handle_after(scope.row.week3)" @click="submit(scope.row,1,3)">预约</el-button>
						<span v-else></span>
					</template>
				</el-table-column>
			</el-table-column>
			<el-table-column label="周四" align="center">
				<el-table-column label="上午" align="center">
					<template #default="scope">
						<el-button v-if="handle_morning(scope.row.week4)" @click="submit(scope.row,0,4)">预约</el-button>
						<span v-else></span>
					</template>
				</el-table-column>
				<el-table-column label="下午" align="center">
					<template #default="scope">
						<el-button v-if="handle_after(scope.row.week4)" @click="submit(scope.row,1,4)">预约</el-button>
						<span v-else></span>
					</template>
				</el-table-column>
			</el-table-column>
			<el-table-column label="周五" align="center">
				<el-table-column label="上午" align="center">
					<template #default="scope">
						<el-button v-if="handle_morning(scope.row.week5)" @click="submit(scope.row,0,5)">预约</el-button>
						<span v-else></span>
					</template>
				</el-table-column>
				<el-table-column label="下午" align="center">
					<template #default="scope">
						<el-button v-if="handle_after(scope.row.week5)" @click="submit(scope.row,1,5)">预约</el-button>
						<span v-else></span>
					</template>
				</el-table-column>
			</el-table-column>
		</el-table>
	</div>
</template>

<script>
	import {
		baseUrl
	} from "@/utils/request";
	import axios from "axios";

	export default {
		data() {
			return {
				orderResult: null,
	
				forminfo: {
					reserveId: null,
					reserveTime: null,
					reserveDay: null,
					studentId: null,
					userId: null,
				},
				
			};
		},
		created() {
			this.load();
		},
		computed: {
			handle_morning() {
				return function(param) {
					if (parseInt(param.substring(0, 1)) > 0) {
						return true;
					} else {
						return false;
					}
				};
			},
			handle_after() {
				return function(param) {
					if (parseInt(param.substring(1, 2)) > 0) {
						return true;
					} else {
						return false;
					}
				};
			},
		},
		methods: {
			load() {
				let studentId = JSON.parse(sessionStorage.getItem("user")).student.studentId	
				axios.post(baseUrl + "/reserveTime/findByStudentTime", {
						studentId: studentId,
						reserveWeek: "0",
					})
					.then((res) => {
						console.log(res.data);
						this.orderResult = res.data.data;
					});
			},
			submit(p1,p2,p3) {
				let today = new Date()
				today = today.getDay()
				let temp = parseInt(p3)
				if(today>=temp){
					this.forminfo.reserveDay = (temp + 7 - today)+''
				}else{
					this.forminfo.reserveDay = (temp - today) + ''
				} 
				this.forminfo.reserveTime = p2+""
				this.forminfo.userId = p1.userId+""
				this.forminfo.reserveId =  p1.reserveTimeId+""
				this.forminfo.studentId = JSON.parse(sessionStorage.getItem("user")).student.studentId+""
				// console.log(this.forminfo)
				axios.post(baseUrl + "/reserveTime/setReserve", this.forminfo)
				.then(res => {
					console.log(res.data)
					if(res.data.data=="预约失败，请重新预约！"){
						setTimeout(() => {
							this.$message({
								type: "error",
								message: "预约失败，请重新预约！",
							});   
						}, 800);
            		}else{
						setTimeout(() => {
							this.$message({
								type: "success",
								message: "预约成功",
							});   
						}, 800);
					}
					
				});
			},
		},
	};
</script>

<style scoped>
</style>
